

//tab切换
var titles = document.querySelectorAll('.tab-title')
var contents = document.querySelectorAll('.tab_content11')
titles.forEach((item, index) => {
    item.addEventListener('click', () => {
        contents.forEach(item2 => {
            item2.classList.remove('show11')
        })
        titles.forEach(item2 => {
            item2.classList.remove('color')
        })
        contents[index].classList.add('show11')
        titles[index].classList.add('color')
    })
})

//渲染
function apply() {
    $.ajax({
        url: 'http://localhost:3000/list',
        type: 'GET',
        dataType: 'json',
        headers: {
            Authorization: "Bearer " + localStorage.getItem("token"),
        },
        success: (a) => {
            console.log(a);
            var box = $('.box1')
            var data = a.data
            data.forEach((item) => {
                box.append(`<div class="wrap">
                            <img src="${item.link}" >
                            <button onclick="update(${item.id})">修改照片</button>
                            <button onclick="dele(${item.id})">删除照片</button>
                        </div>`)
            })

        }
    })
}
apply()

//添加照片
function created() {
    $('.add').css('display', 'block');
}
function add_yes() {
    var box = $('.box1')
    var link = $('.add_link').val()
    $.ajax({
        url: 'http://localhost:3000/add',
        type: 'post',
        data: {
            link: link
        },
        dataType: 'json',
        headers: {
            Authorization: "Bearer " + localStorage.getItem("token"),
        },
        success: () => {
            box.html(" ");
            $('.add_link').val('')
            apply();
            $(".add").css("display", "none");
        },
        error: (e) => {
            console.log(e);
        }
    })
}

//取消添加
function add_no() {
    var add = document.querySelector('.add')
    add.style.display = 'none'
}
//删除照片
function dele(id) {
    var box = $('.box1')
    $.ajax({
        url: `http://localhost:3000/del?id=${id}`,
        type: 'delete',
        data: {
            id: id
        },
        dataType: 'json',
        headers: {
            Authorization: "Bearer " + localStorage.getItem("token"),
        },
        success: () => {
            box.html(" ");
            apply();
        },
        error: (e) => {
            console.log(e);
        }
    })
}


// 修改照片
var q;
function update(id) {
    $('.update').css('display','block');
    q = id;
}

function update_yes() {
    var box = $('.box1')
    var link = $('.add2_link').val()

    $.ajax({
        url: `http://localhost:3000/upd?id=${q}`,
        type: 'post',
        data: {
            link:link,
            id: q,
        },
        dataType: 'json',
        headers: {
            Authorization: "Bearer " + localStorage.getItem("token"),
        },
        success: () => {
            box.html(" ");
            $('.add2_link').val('')
            apply();
            $(".update").css("display", "none");
        },
        error: (e) => {
            console.log(e);
        }
    })
}

// 取消修改
function update_no() {
    var update = document.querySelector('.update')
    update.style.display = 'none'
}

//搜索
// var w
function search() {
    $('.add2').css('display', 'block');
    // w = id;
}

function search_yes() {
    var id = $('.add3_link').val()

    $.ajax({
        url: `http://localhost:3000/search?id=${id}`,
        type: 'get',
        // data: {
        //     id: id,
        // },
        dataType: 'json',
        headers: {
            Authorization: "Bearer " + localStorage.getItem("token"),
        },
        success: (a) => {
            console.log(a);
            
            var box = $('.box1')
            var data = a.data
            box.html(" ");
            $('.add3_link').val('')
            $(".add2").css("display", "none");
            data.forEach((item) => {
                box.append(`<div class="wrap">
                            <img src="${item.link}" >
                            <button onclick="update(${item.id})">修改照片</button>
                            <button onclick="dele(${item.id})">删除照片</button>
                        </div>`)
            })
        },
        error: (e) => {
            console.log(e);
        }
    })
}

// 取消搜索
function search_no() {
    var search = document.querySelector('.add2')
    search.style.display = 'none'
}